<template>
	<view class="flex-column full-parent">
		<view class="flex-column flex-1 overflow-hidden">
			<scroll-view scroll-y="true">
				<view class="top" v-if="data">
					<view class="title">{{data.title}}</view>
					<view class="authtime flex-row">
						<view class="auth">{{data.auth}}：</view>
						<view class="time">{{dayjs(data.createTime).format("YYYY-MM-DD")}}</view>
					</view>
					<view class="content">
						<text>{{data.content}}</text>
					</view>
				</view>
			</scroll-view>

		</view>
		<view class="bottom flex-column" v-if="data">
			<view class="bottom-container flex-row">
				<view class="text-container" @click="share">
					<uni-icons type="redo" size="24" color="#222222"></uni-icons>
					分享
					<!-- #ifdef MP-WEIXIN -->
					<button open-type="share" class="bottom-share"> 分享 </button>
					<!-- #endif -->
				</view>

				<!-- 				<view class="text-container" @click="chat">
					<uni-icons type="chat" size="24" color="#222222"></uni-icons>
					<text v-if="data.chat_count">{{data.chat_count}}</text>
				</view> -->

				<view class="text-container" @click="handClick">
					<uni-icons v-if="data.is_like" type="hand-up-filled" size="24" color="#dd524d"></uni-icons>
					<uni-icons v-else type="hand-up" size="24" color="#222222"></uni-icons>
					<text v-if="data.like_count"
						:class="data.is_like ? 'is_like_select' : 'is_like_normal'">{{data.like_count}}</text>
				</view>

				<view class="text-container" @click="favorite">
					<uni-icons v-if="data.is_favorite" type="star-filled" size="24" color="#dd524d"></uni-icons>
					<uni-icons v-else type="star" size="24" color="#222222"></uni-icons>
				</view>
			</view>

			<view class="safe-area-inset-bottom"> </view>
		</view>

		<!-- 分享弹窗 -->
		<uni-popup ref="sharePopup" type="bottom">
			<view class="popupContent">
				<text>分享至</text>
			</view>
		</uni-popup>

		<!-- 评论弹窗 -->
		<uni-popup ref="chatPopup" type="bottom">
			<view class="chatPopupContainer">
				<view class="chatPopupBarView centent-parent flex-row">
					<text class="chatPopupTitle">0条评论</text>
				</view>
			</view>
		</uni-popup>
	</view>
</template>

<script setup>
	import {
		onLoad
	} from '@dcloudio/uni-app'
	import {
		ref
	} from 'vue';

	import debounce from "lodash/debounce"

	import dayjs from 'dayjs';

	const db = uniCloud.importObject("consultObj");

	const data = ref(null)

	onLoad(async (paramters) => {
		let {
			id
		} = paramters;
		let res = await db.getDetail(id);
		data.value = res.data;
		console.log(data.value);
	})
	// 分享
	const sharePopup = ref(null);
	// 评论
	const chatPopup = ref(null);
	// 
	const likeObj = uniCloud.importObject('likeObj')
	const favoriteObj = uniCloud.importObject('favoriteObj')

	function share() {
		// #ifdef MP-WEIXIN
		return
		// #endif
		// #ifdef APP
		uni.share({
			type: 0,
			title: data.value.title,
			summary: data.value.content,
			href: 'https://static-mp-a8e9b1de-29f1-4d56-ab5d-ddac9aca38ae.next.bspapp.com/jiaopei/#/pages/index/zixunxiangqing/zixunxiangqing?id=' +
				data.value._id
		})
		// #endif
		// #ifndef APP
		console.log("是否支持分享", navigator.canShare());
		if (navigator.canShare()) {

		}
		// #endif
	}

	function chat() {
		chatPopup.value.open()
	}

	// 点赞
	const handClick = debounce(async () => {
		uni.showLoading({
			mask: true
		})
		let res = await likeObj.like(data.value._id, 0, data.value.is_like)
		let flag = res.errCode == 0
		if (flag) {
			data.value.is_like = !data.value.is_like
			data.value.is_like ? data.value.like_count++ : data.value.like_count--
			uni.$emit('consult_is_like_emit', {
				_id: data.value._id,
				is_like: data.value.is_like,
				like_count: data.value.like_count
			})
		}
		uni.hideLoading()
		uni.showToast({
			title: flag ? (data.value.is_like ? "已点赞" : "已取消点赞") : res.errMsg,
			icon: data.value.is_like ? 'success' : 'fail'
		})
	}, 500, {
		leading: true,
		trailing: false
	})

	// 收藏
	const favorite = debounce(async () => {
		uni.showLoading({
			mask: true
		})
		let res = await favoriteObj.favorite(data.value._id, 0, data.value.is_favorite)
		let flag = res.errCode == 0
		if (flag) {
			data.value.is_favorite = !data.value.is_favorite
		}
		uni.hideLoading()
		uni.showToast({
			title: flag ? (data.value.is_favorite ? "已收藏" : "已取消收藏") : res.errMsg,
			icon: data.value.is_favorite ? 'success' : 'fail'
		})
	}, 300, {
		leading: true,
		trailing: false
	})
</script>
<style lang="scss">
	page {
		width: 100%;
		height: 100%;
		background: $me-color-background;
	}
</style>

<style lang="scss" scoped>
	scroll-view {
		background: white;
		box-sizing: border-box;
		width: 100%;
		height: 100%;

		.top {
			padding: 28rpx 40rpx;

			.title {
				font-size: 36rpx;
			}

			.authtime {
				margin-top: 20rpx;
				font-size: 24rpx;

				.auth {
					color: $me-color-blue;
				}

				.time {
					color: $me-color-gray-6;
				}
			}

			.content {
				margin-top: 25rpx;

				text {
					line-height: 1.8em;
					font-size: 28rpx;
				}
			}
		}
	}

	.bottom {
		border-top: 1rpx solid $me-color-background;
		background-color: white;
	}

	.bottom-container {
		height: 96rpx;
		justify-content: space-around;
	}

	.text-container {
		padding: 10rpx;
		display: flex;
		font-size: 26rpx;
		color: $me-color-gray-1;
		align-items: center;
		position: relative;

		.bottom-share {
			position: absolute;
			left: 0;
			top: 0;
			opacity: 0;
			width: 100%;
		}

		.is_like_select {
			color: #dd524d;
		}

		.is_like_normal {
			color: #222222;
		}
	}

	.chatPopupContainer {
		border-radius: 20rpx 20rpx 0 0;
		height: 80vh;
		background-color: white;
		overflow: hidden;
	}

	.chatPopupBarView {
		height: 100rpx;
		background-color: $me-color-background;
		font-size: 32rpx;
		font-weight: bold;
		color: $me-color-gray-1;
	}

	.chatPopupTitle {}
</style>